<html>
	<head>
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">
		<LINK href="main.css" rel="stylesheet" type="text/css">
		<script src="jquery-1.9.0.min.js"></script>
		<script src="prog.js"></script>
	</head>

	<body>
		<div id="modeDiv">
			<a id="quizMode" href="#" onclick="toggleQuiz(true)">quiz</a>
			<a id="reviewMode" href="#" onclick="toggleQuiz(false)">review</a>
		</div>

		<div id="quizDiv">
			<div id="charDiv"></div>
			</br>
			<div id="choiceDiv">
				<button id="c1" onClick="checkAnswer(this.innerHTML)">c1</buton>
				<button id="c2" onClick="checkAnswer(this.innerHTML)">c2</buton>
				<button id="c3" onClick="checkAnswer(this.innerHTML)">c3</buton>
				<button id="reload" onClick="getNewQuiz()">reload</button>
			</div>
			<div id="feedbackDiv">
				<h1 id="answer">Select an answer.</h1>
				<h2 id="feedback"></h2>
				<br>
			</div>
			<div id="settingsDiv">
				<!--input id="useVowels" type="checkbox">Vowels</input-->
			</div>
		</div>

		<div id="reviewDiv">
			<div id="rCharDiv">ㄱ</div>
			<div id="rInfo">
				<h1 id="rName">g</h1>
			</div>
			<div id="rButtonDiv">
				<button id="rNext" onClick="getNext()">next</buton>
			</div>
			<br>
			<div id="rSettingsDiv">
				<!--input id="rUseVowels" type="checkbox">Vowels</input-->
			</div>
		</div>

		<br><br><br>

		<div id="scoreDiv">
			&nbsp;score: 0&nbsp;&nbsp;&nbsp;&nbsp;completed: 0
		</div>
	</body>
</html>